import { useState,useEffect } from 'react'
import logo from './logo.svg'
import './App.css'
import classnames from 'classnames'
import WeUI from 'react-weui'
import Contest from './components/contest'
import {getContestData} from './api/request'
const{
  Toast
}=WeUI



function App() {
  const [tab, setTab] = useState('all')
  const [list, setList] = useState([])
  const [showLoading, setshowLoading] = useState(false)
  // const [tabClasses,setTabClasses]=useState(['item']);
  const tabClasses=['item'];
  useEffect(()=>{
    setTimeout(()=>{
      setTab("dj")
    },2000)
  })
  useEffect(()=>{
    // console.log('------')
    (async()=>{
      setshowLoading(true)
      let {data}=await getContestData()
      setList([
        ...data
      ])
      setshowLoading(false)
    })()
    // tabClasses.push('current')
    // console.log(tabClasses)
    // setTabClasses([
    //   ...tabClasses,
    //   'current'
    // ])

  },[tab])
  // useEffect(()=>{
  //   if(list.length>0){
  //     setshowLoading(false)
  //   }
  // },[list])
  return (
    <div className="App">
      <Contest data={list}/>
      <a href="#" className={classnames('item',{current:tab=='all'})}>全部</a>
      <Toast icon="waiting-circle" show={showLoading}>加载中...</Toast>
    </div>
  )
}

export default App
